<!-- 打印详情-->
<template>
  <div>
    <el-button type="primary" v-print="printObj" @click="dsss">打印</el-button>
    <el-button type="info" @click="$router.go(-1)">关闭</el-button>
    <el-card
      class="docketprintContainer"
      shadow="never"
      v-for="(item, index) in tableData"
      :key="index"
      style="page-break-after: always"
    >
      <div>
        <div class="TestData" style="font-size: 14px; ">
          <table border="1" cellspacing="0" align="center" id="printMe">
            <caption style="margin-bottom: 10px;">
              <h2 align="center">成绩单</h2>
            </caption>
            <tr align="center">
              <td width="150" height="40"><b>姓名</b></td>
              <td width="200" height="40" colspan="2">{{item.name}}</td>
              <td width="150" height="40"><b>学院</b></td>
              <td width="200" height="40">{{item.college}}</td>
            </tr>
            <tr align="center">
              <td width="150" height="40"><b>专业</b></td>
              <td width="200" height="40" colspan="2">{{item.major}}</td>
              <td width="150" height="40"><b>班级</b></td>
              <td width="200" height="40">{{item.classes}}</td>
            </tr>
            <tr align="center">
              <td width="150" height="40"><b>科目</b></td>
              <td width="200" height="40" colspan="2"><b>分数</b></td>
              <td width="150" height="40"><b>评价</b></td>
              <td width="200" height="40"><b>是否补考</b></td>
            </tr>
            <tr align="center" v-for="it in item.achievement" :key="it.id">
              <td width="150" height="40">{{it.subject}}</td>
              <td width="200" height="40" colspan="2">{{it.fraction}}</td>
              <td width="150" height="40">{{it.score}}</td>
              <td width="200" height="40">{{it.makeUp}}</td>
            </tr>
          </table>
        </div>
      </div>
    </el-card>
  </div>
</template>

<script>
import { getScoreListApi } from "@/api/achievement/studentscore";
export default {
  data() {
    return {
      tableData: [],
      id:'',
      printObj: {
        id: "printMe", //打印区域 Dom ID
        popTitle: "成绩单详情",
        extraCss: "https://www.google.com,https://www.google.com",
        extraHead:
          '<meta http-equiv="Content-Language"content="zh-cn"/>,<style> #printMe { height: auto !important; } <style>', //  可以传进去  style tag 标签；注意要逗号分隔   解决特定区域不显示问题；
      },
    };
  },
  created() {},
  mounted() {
    this.id = this.$route.params.id
    getScoreListApi({id:this.id}).then(res=>{
      console.log(res,'打印详情');
      this.tableData = res.rows

    })
    
  },
  methods: {
    dsss() {
      console.log(this.id);
    },
  }
};
</script>

<style scoped>
</style>

